page,.pages{
	// overflow: scroll;
	// height: 100vh;
}

.operateBox{
	&-flex{
		@include flexBetween;
		position: relative;
		height: 100rpx;
		border-radius: 12rpx;
		background: #F9F9F9;
		margin-top: 32rpx;
		padding: 0 24rpx;
	}
	&-flex:nth-of-type(1){
		margin-top: 0;
	}
	&-bg{
		background: $globalColor-style;
		border-radius: 0px 0px 10px 10px;
		min-height: 310rpx;
	}
	&-tabs{
		display: block;
		margin: 0rpx 60rpx;
		&--top{
			margin-top: 44rpx
		}
		&-item{
			@include flexLeft;
			align-items: flex-end;
			margin: 0 0 24rpx;
			&__title{
				width: 26%;
				color: $globalColor-fontStyle;
				font-size: 28rpx;
				font-weight: bold;
				position: relative;
				padding-bottom: 6rpx;
				&--active::before{
					content: '';
					width: 36rpx;
					height: 6rpx;
					background: $globalColor-style;
					position: absolute;
					bottom: 0;
					transform: translateX(50%);
				}
			}
		}
	}
	&-formBox{
		@include flexBetween;
		position: relative;
		height: 100rpx;
		border-radius: 12rpx;
		background: #F9F9F9;
		margin-top: 32rpx;
		padding: 0 24rpx;
		&-list{
			@include flexLeft;
			width: 100%;
			&-icon{
				width: 40rpx;
				height: 40rpx;
				margin-right: 20rpx;
			}
			&--width40{
				width: 45%;
			}
			&-title{
				color: #333333;
				font-size: 32rpx;
				font-weight: bold;
				width: 15%;
				// background: url(../../static/public/icon-operate-next.png) no-repeat;
				background-position: calc(100% - 20rpx) center;
				background-size: 20rpx 12rpx;
			}
			&-titleWords{
				@include flexLeft;
				flex-wrap: wrap;
				padding: 30rpx 0;
			}
			&-words{
				font-size: 24rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #000;
				margin: 10rpx 0 32rpx;
				&--active{
					color: $globalColor-style;
				}
			}
			&-header{
				@include flexLeft;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 28rpx;
				color: #000000;
				margin: 0;
			}
			&-tips{
				font-size: 24rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #969699;
				margin: 0rpx 0 20rpx;
			}
			&.showCloseBtn {
				.operateBox-formBox-list-image__clear--active{
					display: flex;
				}
			}
			input{
				flex: 1;
				font-size: 28rpx;
				border: none;
				text-align: left;
				color: #000000;
			}
			textarea{
				flex: 1;
				font-size: 28rpx;
				border: none;
				height: 150rpx;
				color: #000000;
			}
			&-image{
				@include flexRight;
				position: relative;
				z-index: 9;
				&__clear{
					margin-right: 14rpx;
					image{
						width: 30rpx;
						height: 30rpx;
					}
					&--active{
						display: none;
					}
				}
				&__see{
					image{
						width: 35rpx;
						height: 35rpx;
					}
				}
				&__all{
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #FA6A45;
				}
				&__code{
					image{
						width: 150rpx;
						height: 15rpx;
					}
					.code{
						font-family: PingFang SC, PingFang SC;
						font-size: 24rpx;
						color: #FA6A45;
						background: linear-gradient( 180deg, #FA6A45 0%, #F94123 100%);
						-webkit-background-clip: text;
						-webkit-text-fill-color: transparent;
					}
					.code--gery{
						background: #5C5C5C;
						border-radius: 76rpx;
						font-size: 24rpx;
						font-family: Noto Sans SC, Noto Sans SC;
						font-weight: 400;
						color: #808080;
						padding: 10rpx 14rpx;
						text-align: center;
						white-space: nowrap;
					}
				}
			}
		}
		&-lists{
			width: 70%;
		}
		&-listBg{
			background: #F6F6F6;
			border-radius: 14rpx;
			border: none;
		}
		&-listBorder{
			border-radius: 0;
			border-bottom: 1px solid #EAEAEA;
			border-top: none;
			border-left: none;
			border-right: none;
			padding: 28rpx 0rpx;
			margin: 0rpx 0rpx 30rpx;
		}
		&-flexLeftColumn{
			@include flexLeftColumn;
		}
		&-noBorder{
			border: none;
		}
	}
	&-btn{
		width: 100%;
		&--between{
			@include flexBetween;
		}
		&-chioce{
			// width: 100%;
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			color: #141414;
			padding: 25rpx 0;
			border-radius: 1762rpx;
			color: #EE3A33;
			background: #EE3A33;
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			margin: 32rpx 24rpx 24rpx;
			text-align: center;
			letter-spacing: 2rpx;
		}
		&-title{
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #292929;
			text-align: center;
			&--active{
				font-size: 28rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				background: linear-gradient( 135deg, #0067F2 0%, #3DBBFF 99%);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
			}
		}	
	}
	
	&-bottom{
		@include flexLeft;
		&-img{
			width: 32rpx;
			height: 32rpx;
			margin-right: 8rpx;
		}
		&-title{
			font-size: 24rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #999999;
			&-choice{
				font-size: 24rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
			}
		}
	}
	&-agreement{
		margin: 40rpx 0 0;
		@include flexLeft;
		label{
			border: 1px solid $globalColor-border;
			width: 30rpx;
			height: 30rpx;
			border-radius: 50%;
			margin-right: 11rpx;
		}
		.checkbox-active{
			// background: url(../../static/public/check-active.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;
			border: 1px solid transparent;
			// .checkbox{
			// 	margin: 5rpx;
			// 	background: $globalColor-style;
			// 	width: 18rpx;
			// 	height: 18rpx;
			// 	border-radius: 50%;
			// }
		}
		&-title{
			color: #666666;
			font-size: 24rpx;
		}
		&-name{
			color: $globalColor-style;
			font-size: 24rpx;
		}
	}
	&-bottomBox{
		// margin: 15% auto 50rpx;
		background: #2B2B2B;
		width: 100%;
		padding: 0 0;
		position: fixed;
		bottom: 0rpx;
		padding-bottom: 20rpx;
		z-index: 99;
	}
	&-bottomBoxFor{
		position: absolute;
		bottom: 5rpx;
		width: 100%;
		padding: 0 31rpx;
	}
	&-titleBox{
		@include flexLeftColumn;
		&__title{
			@include flexLeft;
			margin-bottom: 8rpx;
			.title{
				font-size: 28rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #000000;
			}
			.num{
				font-size: 28rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: $globalColor-style;
			}
			.tips{
				font-size: 24rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: rgba(0,0,0,0.6);
			}
		}
	}
	&-flexBetween{
		@include flexBetween;
		margin-bottom: 75rpx;
		&__tips{
			font-size: 24rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			background: linear-gradient( 180deg, #FA6A45 0%, #F94123 100%);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}
		.balance{
			font-family: DIN-Bold, DIN-Bold;
			font-weight: 600;
			font-size: 30rpx;
			color: #131414;
		}
	}	
}
.initBtn{
	height: 100rpx;
	line-height: 100rpx;
	padding: 0;
	background: linear-gradient( 180deg, #FA6A45 0%, #F94123 100%);
	border-radius: 20rpx;
}
.text-right{
	text-align: right;
	font-size: 24rpx;
	color: #666666;
	line-height: 36rpx;
	margin-top: 24rpx;
}
.to-reg{
	font-size: 28rpx;
	color: #ACACAC;
	line-height: 33rpx;
	text-align: center;
	margin-top: 154rpx;
}
.red{
	color: #FA6A45;
	background: linear-gradient( 180deg, #FA6A45 0%, #F94123 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;

}
.firstBox{
		&-bottom{
			@include flexLeft;
			margin: 10rpx 32rpx 0rpx;
			margin-top: 80rpx;
			&-img{
				width: 32rpx;
				height: 32rpx;
				margin-right: 16rpx;
			}
			&-title{
				font-size: 24rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #999;
				&-choice{
					font-size: 24rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					background:linear-gradient( 180deg, #FA6A45 0%, #F94123 100%) ;
					-webkit-background-clip: text; /* Chrome, Safari */
					background-clip: text;
					-webkit-text-fill-color: transparent; /* Chrome, Safari */
					color: transparent; /* 在不支持-webkit-text-fill-color的浏览器上，确保文字不可见 */
				}
			}
		}
	}

.success{
	@include flexCenterColumn;
	margin-top: 30%;
	&-image{
		image{
			width: 110rpx;
			height: 110rpx;
		}
	}
	&-title{
		font-size: 42rpx;
		font-weight: bold;
		color: $globalColor-fontStyle;
		margin: 25rpx 0 60rpx;
	}
	&-wrapper{
		@include flexCenterColumn;
		&__tips{
			color: #999999;
			font-size: 24rpx;
			line-height: 40rpx;
		}
	}
}

.operateTips{
	font-size: 24rpx;
	font-family: PingFang SC, PingFang SC;
	font-weight: 400;
	color: #FFFFFF;
	padding: 26rpx 20rpx 24rpx;
	background: #0EB650;
	border-radius: 12rpx;
	margin-top: 40rpx;
}
